<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
  	<head>
		<title>Lucar 共享汽车，我们出行</title>
  	</head>
	<link rel="stylesheet" type="text/css" href="lucar-css/head-css.css" />
	<link rel="stylesheet" type="text/css" href="lucar-css/index-css.css">
	<link rel="stylesheet" type="text/css" href="lucar-css/orders-css.css">
	<script src="lucar-script/head-script.js"></script>
	<script src="lucar-script/jquery-3.2.1-jquery.min.js"></script>
	<body>
	  	<div id="head">
			<div id="h-logo">
				<img src="lucar-image/logo.png" class="hl">
			</div>
			<div id="h-right">
				<span id="hr-useCar" class="hr-span" onmouseover="headimg(1);" onMouseOut="headimg(2);">
					<img id="uCOut" src="lucar-image/useCar-Out.png" class="hr-image" style="display:block">
					<img id="uCOn" src="lucar-image/useCar-On.png" class="hr-image" style="display:none">
				</span>
				<span id="hr-aboutUs" class="hr-span" onmouseover="headimg(3);" onMouseOut="headimg(4);">
					<img id="aUOut" src="lucar-image/aboutUs-Out.png" class="hr-image" style="display:block">
					<img id="aUOn" src="lucar-image/aboutUs-On.png" class="hr-image" style="display:none">
				</span>
				<span id="register" class="button" onMouseOver="headbutton(1);" onMouseOut="headbutton(2);"><b class="hr-text">注册</b></span>
				<span id="login" class="button" onMouseOver="headbutton(3);" onMouseOut="headbutton(4);"><b class="hr-text">登录</b></span>
			</div>
		</div>
		<%@ page import="java.util.*"%>
		<% 
			request.setCharacterEncoding("utf-8");
			String carNo=(String)request.getAttribute("carId");
			System.out.println(carNo);
		%>
		<div id="order_div">
			<jsp:useBean id="time" class="java.util.Date"/> 
			<s:form action="checkOrders" namespace="/">
				<div id="order_head">
            		<label id="orderNo">订单号：</label><label id="orderNo">订单号：</label><s:textfield id="orderNo_input" name="orders.orderNo" value="" readonly="true"/>
					<label id="beginPark">借车点：</label><s:textfield id="beginPark_input" name="orders.beginParkId" value="" readonly="true"/>
            	</div>
				<div id="order-show">
            		<div id="carImg"></div>
                	<span id="carId_span">汽车ID：</span>
            		<s:textfield id="carId_input" name="orders.carId" value="" readonly="true"/>
					<span id="carName_span">汽车名称：</span>
					<span id="carName"></span>
					<span id="carType_span">汽车类型：</span>
					<span id="carType"></span>
					<span id="power_span">汽车电量：</span>
					<span id="power"></span>
					<span id="status_span">汽车状态：</span>
					<span id="status"></span>
                	<span id="userId_span">用户名：</span>
                	<s:textfield id="userId" name="orders.userId"/>
                    <span id="userName_span">用户姓名：</span>
					<span id="userName">曾子隽</span>
                    <span id="orderStatus_span">订单状态：</span>
					<span id="orderStatus">未提交</span>
            	</div>
				<s:submit value="提交订单" id="orderSubmit"/>
			</s:form>
		</div>
	</body>
	
<script type="text/javascript">
window.onload = function(){
	function box(){
		var oBox = document.getElementById("order_div");
		var L1 = oBox.offsetWidth;
		var Left = (document.documentElement.clientWidth-L1)/2;
		oBox.style.left = Left+'px';
	}
	box();
	window.onresize = function(){
        box();
    }
    $(document).ready(function(){
    	//获取后台传回来的json值，此json值其实为一个list
		$.ajax({
			type:"get",
			url:'<%=basePath%>selectOrdersCar.action',
			data:"carId=<%=carNo%>",
			dataType:"json",
			success:function(cars){
				if(cars.length!=0){
					for(var i=0;i<cars.length;i++){
						var carId=cars[i].carId;
						var carName=cars[i].carName;
						var carType=cars[i].carType;
						var power=cars[i].power;
						var parkId=cars[i].parkId;
						var carStatus=cars[i].status;
						$("#carId_input").attr("value",carId);
						$("#beginPark_input").attr("value",parkId);
						$("#carName").text(carName);
						$("#carType").text(carType);
						$("#power").text(power);
						$("#status").text(carStatus);
					}
				}
			},
			error:function(car){
			}
		})
	});
	
}
</script>
</html>